import React from 'react';

import {connect} from 'dva'
import moment from 'moment'

import { GisAbstract } from 'components/Abstract'
import Title from 'components/Title'

const nowTimeStamp = Date.now();
const now = new Date(nowTimeStamp);
const time = moment(now).format('YYYY')
const thisYear = `${time}-01-01 00:00:00`

const IndicatorsData = {}
@connect(({gis}) => ({...gis}))
class Indicators extends React.Component {
    static defaultProps = {
      abstractConf: {
        label: '重点指标监控', list: [
          { label: '管网总长', unit: 'm', field: 'total', icon: 'abstract',
            server: { payload: { where: "1=1" }, alias: 'total' },
          },
          {
            label: '本年新增管线', unit: 'm', field: 'newline', icon: 'abstract',
            server: { payload: { where: `1=1 and crttime > '${thisYear}'` }, alias: 'newline' },
          },
          {
            label: 'DN300以上', unit: 'm', field: 'u300', icon: 'abstract',
            server: { payload: { where: "1=1 and 口径 >= '300'" }, alias: 'u300'},
          },
          { label: 'DN300以下', unit: 'm', field: 'd300', icon: 'abstract',
            server: { payload: { where: "1=1 and 口径 < '300'" }, alias: 'd300'},
          },
          { label: 'DN100以上', unit: 'm', field: 'u100', icon: 'abstract',
            server: { payload: { where: "1=1 and 口径 >= '100'" }, alias: 'u100'},
          },
          { label: 'DN100以下', unit: 'm', field: 'd100', icon: 'abstract',
            server: { payload: { where: "1=1 and 口径 < '100'"}, alias: 'd100'},
          },
          { label: '直埋', unit: 'm', field: 'zhimai', icon: 'abstract',
            server: { payload: { where: "1=1 and 埋设方式 = '直埋'"}, alias: 'zhimai'},
           },
          { label: '管廊', unit: 'm', field: 'guanglang', icon: 'abstract',
           server: { payload: { where: "1=1 and 埋设方式 = '管廊'"}, alias: 'guanglang'},
          },
        ]
      }
    }

  constructor(props) {
    super(props);

    this.state = {
      time,
      IndicatorsData: {}
    }
  }

  componentDidMount() {
    this.init();
  }

  init = async () => {
    await this.setDateIndicators()
  }

  // 人工维护数据：指标逻辑
  queryIndicators = async (server) => {
    let { payload, alias } = server;
    const outStatistics = `[{"statisticType":"SUM","onStatisticField":"管长","outStatisticFieldName": ${alias}}]`

    Object.assign(payload, { outStatistics })
    await this.props.dispatch({
      type: 'gis/queryIndicators',
      payload
    }).then(() => {
      // 请求成功后，合并更新state
      Object.assign(IndicatorsData, this.props.IndicatorsResource)
      this.setState({
        IndicatorsData
      })
    });
  }
  setDateIndicators = () => {
    const { abstractConf } = this.props;
    const { list } = abstractConf;
    list.map(ele => {
      const { server } = ele;
      // 如果有 server则调用
      if(server) this.queryIndicators(server);
    })
  }
  

  // 指标渲染
  RenderIndicators = () => {
    const { abstractConf } = this.props;
    const { label, list } = abstractConf;

    return (
      <Title title={label} style={{'padding': '2%'}}>
        <GisAbstract
          dataSource={IndicatorsData}
          columns={list}
          className={'col-8'}/>
      </Title>
    )
  }

  render() {
    return (
      <>{this.RenderIndicators()}</>
    )
  }
}

export default Indicators;
